<template>
  <!-- 方案修改和实施情况 -->
   <a-table class="takeOut-hover" :columns="columns" bordered :pagination="false" :data-source="tableData" >
     <template v-for="(col,colIindex) in columns" :slot="col.dataIndex" slot-scope="text, record,index">
       <div :key="colIindex">
           <UploadList
               v-if="col.dataIndex === 'fileInfoVOS'"
                businessCode="FACE13"
                :disabled="editModel == 0"
                uploadType="image"
                :editModel="editModel"
                multiple
                :upload-arrys.sync="record[col.dataIndex]"
              />
          <span v-else>
              {{noValue(record[col.dataIndex],index,col.dataIndex)}}
          </span>
       </div>
     </template>
  </a-table>
</template>
<script>

import { summaryMixin } from "./mergeCell";
import UploadList from '@/components/UploadList'
export default {
  mixins:[summaryMixin], //混入文件
  name: 'a' + Date.now(),
  components: {
    UploadList
  },
  props: {
    tableData: {
      type: Array,
      default() {
        return []
      }
    }
  },
  data() {
    this.columns = [
      { title: '序号',align: 'center',dataIndex: 'serial', width:'4%',scopedSlots: { customRender: 'serial' } },
      {
        title: '所属分公司',
        align: 'center',
        dataIndex: 'branchComName',
        ellipsis: false,
        width:'12%',
        customRender: (value, row, index) => { 
          const obj = {
            children: row.branchComName?row.branchComName:'/',
            attrs: {}
          }
          obj.attrs.rowSpan = this.mergeCellKey(row.branchComId, this.tableData, 'branchComId')
          return obj
        }
      },
      { title: '所属项目名称', align: 'center', dataIndex: 'projectName',width:'16%',scopedSlots: { customRender: 'projectName' }},
      { title: '方案名称', dataIndex: 'programName', align: 'center', ellipsis: false,width:'16%',scopedSlots: { customRender: 'programName' }},
      { title: '方案与现场偏差', dataIndex: 'deviation', align: 'center', ellipsis: false,width:'24%',scopedSlots: { customRender: 'deviation' }},
      { title: '现场问题照片', dataIndex: 'fileInfoVOS', align: 'center', ellipsis: false,width:'12%',scopedSlots: { customRender: 'fileInfoVOS' }},
      { title: '限期整改措施', dataIndex: 'rectification', align: 'center', ellipsis: false,width:'16%',scopedSlots: { customRender: 'rectification' }},
    ]
    return {
      editModel:0
    }
  },
  methods: {
  },
  mounted() {

  }
}
</script>
<style lang="less" scoped>
@deep: ~'>>>';
.takeOut-hover{
  @{deep} .ant-table-tbody > tr > td{
      padding: 8px 16px!important;
  }
  @{deep} .ant-upload-list-picture-card-container{
     width: 80px!important;
     height: 80px!important;
     margin-bottom: 0!important;
  }
    @{deep} .ant-upload-list-item {
        width: 80px!important;
        height: 80px!important;
    }
    @{deep} .ant-upload-list-item-info:before{
      left: 0!important;
    }
}
</style>
